import React, { Component } from 'react'
import { connect } from 'react-redux'
import { LoginWrapper, LoginBox, Input, Button } from './style';
import { login } from './store/createActions'
import { Redirect } from 'react-router-dom'

class index extends Component {
    render() {
        const {loginStatus} = this.props
        if(!loginStatus){
            return (
                <LoginWrapper>
                    <LoginBox>
                        <Input ref={(input)=>{this.account=input}} placeholder="输入密码" />
                        <Input ref={(input)=>{this.password=input}} type="password" placeholder="输入账号" />
                        <Button onClick={() => {this.props.login(this.account, this.password)}}>登录</Button>
                    </LoginBox>
                </LoginWrapper>
            )
        }else{
           return <Redirect to="/" /> 
        }

      
    }
}
const mapProps = (state) => ({
    loginStatus: state.login.get('login')
})
const mapDispath = (dispatch) => ({
    login(account, password){
        dispatch(login(login(account.value, password.value)))
    }
})

export default connect(mapProps, mapDispath)(index)